<template>
  <div>
    <el-dialog :title="dialogData.title"
               :visible.sync="visible"
               v-loading="loading"
               center
               :before-close="modalClose"
               :close-on-click-modal="false"
               :close-on-press-escape="false"
               width="90%">
      <el-form :model="formdata"
               label-position="right"
               ref="formdata"
               label-width="150px"
               :rules='rules'>
        <el-form-item label="服务名称："
                      prop="name">
          <el-input v-model="formdata.name"
                    maxlength="50"
                    show-word-limit
                    autocomplete="off"
                    style="width:50%"
                    placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="所属分类："
                      prop="healthRiskTypeId">
          <el-select v-model="formdata.healthRiskTypeId"
                     clearable
                     style="width:50%">
            <el-option v-for="item in healthRiskType"
                       :key="item.id"
                       :label="item.name"
                       :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="标签：">
          <el-input v-model="formdata.label"
                    maxlength="20"
                    show-word-limit
                    autocomplete="off"
                    style="width:50%"
                    placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="列表图片："
                      prop="imageUrl">
          <el-upload class="avatar-uploader"
                     :action="imageUploadUrl"
                     :show-file-list="false"
                     accept=".JPG, .PNG, .JPEG,.jpg, .png, .jpeg"
                     :on-success="handleAvatarSuccess"
                     :before-upload="beforeAvatarUpload">
            <img v-if="formdata.imageUrl"
                 :src="formdata.imageUrl"
                 class="avatar">
            <i v-else
               class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
        </el-form-item>
        <el-form-item label="详情图片："
                      prop="detailImageUrl">
          <el-upload multiple
                     :limit='6'
                     :action="imageUploadUrl"
                     accept=".JPG, .PNG, .JPEG,.jpg, .png, .jpeg"
                     list-type="picture-card"
                     :on-success="handlePictureCardPreview"
                     :file-list='formdata.detailImage'
                     :on-exceed='onexceed'
                     :on-remove='onremove'
                     :before-upload="beforeAvatarUpload">
            <i class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
        </el-form-item>
        <el-form-item label="服务选项："
                      prop="itemList">
          <el-button type="success"
                     @click="handleAdd(0)">新 增 一 项</el-button>
          <el-table :data="formdata.itemList"
                    style="width: 100%"
                    border
                    class="mt-20">
            <el-table-column prop="number"
                             label="价格（元）">
              <template slot-scope="scoped">
                <el-input-number :min="0"
                                 :precision="2"
                                 :controls="false"
                                 v-model="scoped.row.price"
                                 @blur="hadnleInput"
                                 type="number"
                                 placeholder="请输入价格"
                                 class="w-200"></el-input-number>
              </template>
            </el-table-column>
            <el-table-column prop="num"
                             label="数量">
              <template slot-scope="scoped">
                <el-input-number :min="0"
                                 :precision="0"
                                 :controls="false"
                                 v-model="scoped.row.num"
                                 @blur="hadnleInput"
                                 type="number"
                                 placeholder="非必填"
                                 class="w-200"></el-input-number>
              </template>
            </el-table-column>
            <el-table-column prop="unit"
                             label="单位">
              <template slot-scope="scoped">
                <el-select v-model="scoped.row.unit"
                           clearable
                           @change="hadnleInput"
                           placeholder="请选择单位">
                  <el-option label="小时"
                             :value="1"></el-option>
                  <el-option label="次"
                             :value="2"></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column prop="detectFee"
                             label="检测分成费用">
              <template slot-scope="scoped">
                <el-input-number :min="0"
                                 :precision="2"
                                 :controls="false"
                                 v-model="scoped.row.detectFee"
                                 placeholder="请输入检测分成费用"
                                 class="w-200"></el-input-number>
              </template>
            </el-table-column>
            <el-table-column prop="extendFee"
                             label="推广分成">
              <template slot-scope="scoped">
                <el-input-number :min="0"
                                 :precision="2"
                                 :controls="false"
                                 v-model="scoped.row.extendFee"
                                 placeholder="请输入推广分成费用"
                                 class="w-200"></el-input-number>
              </template>
            </el-table-column>

            <el-table-column prop="option"
                             label="操作"
                             width="100">
              <template slot-scope="scoped">
                <el-button type="text"
                           @click='delRow(scoped.$index,formdata.itemList,2)'>删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-form-item>

        <el-form-item label="标配服务："
                      prop="standardService">
          <el-input v-model="formdata.standardService"
                    maxlength="500"
                    show-word-limit
                    type="textarea"
                    :rows="4"
                    autocomplete="off"
                    style="width:50%"
                    placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="服务医院："
                      prop="hospitalList">
          <Select v-model="formdata.hospitalListNum"
                  filterable
                  multiple
                  remote
                  clearable
                  placeholder="请输入医院名称"
                  style="width:50%"
                  :remote-method="gethospitalList"
                  @on-change="changeHospital">
            <Option v-for="option in options1"
                    :value="option.hospitalId"
                    :label="option.name"
                    :key="option.hospitalId">{{option.name}}</Option>
          </Select>
        </el-form-item>
        <el-form-item label="是否是重点合作医院："
                      prop="emphasisHospital"
                      label-width="200px">
          <el-checkbox v-for="(item, index) in formdata.hospitalList"
                       :label="item.hospitalId"
                       :checked="item.emphasisHospital===1?true:false"
                       @change="value=>{checkboxItem(value,index, item)}"
                       :key="item.hospitalId">{{item.hospitalName}}</el-checkbox>
        </el-form-item>
        <el-form-item label="可适用的健康风险筛查与监测范围："
                      prop="rangeContent">
          <el-input v-model="formdata.rangeContent"
                    maxlength="500"
                    :rows="4"
                    type="textarea"
                    autocomplete="off"
                    show-word-limit
                    style="width:50%"
                    placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="检测项目配置："
                      prop="detectList">
          <el-button type="success"
                     @click="handleAdd(1,true)">新 增 一 项</el-button>
          <el-table :data="formdata.detectList"
                    style="width: 100%"
                    class="mt-20"
                    border>
            <el-table-column prop="address"
                             label="服务选项">
              <template slot-scope="scoped">
                <!-- 这是每组价格项的healthCheckPackageItemId= {{scoped.row.healthCheckPackageItemId}} -->

                <el-select v-model="scoped.row.price"
                           placeholder="请选择"
                           clearable
                           @change="(value)=>{updataCheckProjectPrice(value,scoped.$index,scoped.row.id)}">
                  <el-option v-for="(item,index) in formdata.itemList"
                             :key="index"
                             :label="`${(item.price || '')+'元'+'/'+(item.num || '')+((item.unit==1?'小时':'次') || '')}`"
                             :value="item.price"></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column prop="name"
                             label="检查项目">
              <template slot-scope="scoped">
                <!-- 下标 {{scoped.row.detectIndex}}
                <br />
                这是行id ={{scoped.row.id}} -->
                <el-input v-model="scoped.row.name"
                          placeholder="请输入检查项目"></el-input>
              </template>
            </el-table-column>
            <el-table-column prop="deviceIdList"
                             label="检测指标">
              <template slot-scope="scoped">
                <el-select v-model="scoped.row.deviceIdList"
                           filterable
                           multiple
                           clearable
                           placeholder="请输入检测指标">
                  <el-option v-for="(option, index) in dataList"
                             :value="option.id"
                             :key="index"
                             :label="option.name"></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column prop="count"
                             label="时长/次数">
              <template slot-scope="scoped">
                <el-input-number :min="0"
                                 :precision="0"
                                 :controls="false"
                                 v-model="scoped.row.count"
                                 type="number"
                                 style="width:100%"
                                 placeholder="请选择时长/次数"></el-input-number>
              </template>
            </el-table-column>
            <el-table-column prop="unit"
                             label="单位">
              <template slot-scope="scoped">
                <el-select v-model="scoped.row.unit"
                           clearable
                           placeholder="请选择单位">
                  <el-option label="小时"
                             :value="1"></el-option>
                  <el-option label="次"
                             :value="2"></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column prop="suggest"
                             label="频率">
              <template slot-scope="scoped">
                <el-input v-model="scoped.row.suggest"
                          placeholder="非必填"></el-input>
              </template>
            </el-table-column>
            <el-table-column prop="option"
                             label="操作">
              <template slot-scope="scoped">
                <el-button type="text"
                           @click='delRow(scoped.$index,formdata.detectList,1)'>删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-form-item>
        <el-form-item label="分成设置："
                      prop="split"
                      label-width="210px">
          <el-radio-group v-model="formdata.split"
                          :disabled="dialogData.info?true:false"
                          @change="handleSetChange">
            <el-radio :label="0">报告不拆分</el-radio>
            <el-radio :label="1">报告拆分</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="是否是特殊筛查项目："
                      prop="specialItem"
                      label-width="210px"
                      v-if="formdata.split === 0">
          <el-radio v-model="formdata.specialItem"
                    :label="0">否</el-radio>
          <el-radio v-model="formdata.specialItem"
                    :label="1">是</el-radio>
        </el-form-item>
        <el-form-item label="是否执行分析复核流程："
                      prop="reCheck"
                      label-width="210px"
                      v-if="formdata.split === 0 && formdata.specialItem === 1">
          <el-radio v-model="formdata.reCheck"
                    :label="0">否</el-radio>
          <el-radio v-model="formdata.reCheck"
                    :label="1">是</el-radio>
        </el-form-item>

        <template v-if="formdata.split === 0 && formdata.reCheck === 1">
          <el-form-item label="分析分成：">
            <el-radio-group v-model="setType"
                            @change="changeSetType">
              <el-radio-button :label="0">医 师</el-radio-button>
              <el-radio-button :label="2">技 师</el-radio-button>
              <el-radio-button :label="7">检验师</el-radio-button>
            </el-radio-group>

            <!-- 医师、技师、检验师 -->
            <template>
              <el-table :data="itemList1"
                        border
                        style="width: 100%"
                        class="mt-20">
                <el-table-column prop="price"
                                 label="价格"
                                 width="200">
                  <template slot-scope="scoped">
                    <el-tag type="primary">{{(scoped.row.price || '')+'元'+'/'+(scoped.row.num || '')+((scoped.row.unit==1?'小时':'次') || '')}}</el-tag>
                  </template>
                </el-table-column>
                <template v-if="itemList1&&itemList1.length">
                  <el-table-column :prop="`${item.doctorTitleName}${index}`"
                                   :label="item.doctorTitleName"
                                   v-for="(item,index) in itemList1[0].healthCheckPackageReadPriceDtosMap[setType]"
                                   :key="index">
                    <template slot-scope="scoped">

                      <el-input v-model="scoped.row.healthCheckPackageReadPriceDtosMap[setType][index].price"
                                :placeholder='`请输入${item.doctorTitleName}`'
                                class="w-150" />
                    </template>
                  </el-table-column>
                </template>
              </el-table>
            </template>
          </el-form-item>
          <!-- 复核分成 -->
          <el-form-item label="复核分成：">
            <el-radio-group v-model="setCheckType"
                            @change="changeSetCheckType">
              <el-radio-button :label="0">医 师</el-radio-button>
              <el-radio-button :label="2">技 师</el-radio-button>
              <el-radio-button :label="7">检验师</el-radio-button>
            </el-radio-group>
            <!-- 医师、技师、检验师 -->
            <el-table :data="itemList1"
                      border
                      style="width: 100%"
                      class="mt-20">
              <el-table-column prop="price"
                               label="价格"
                               width="200">
                <template slot-scope="scoped">
                  <el-tag type="primary">{{(scoped.row.price || '')+'元'+'/'+(scoped.row.num || '')+((scoped.row.unit==1?'小时':'次') || '')}}</el-tag>
                </template>
              </el-table-column>
              <template v-if="itemList1&&itemList1.length">
                <el-table-column :prop="`${item.doctorTitleName}${index}`"
                                 :label="item.doctorTitleName"
                                 v-for="(item,index) in itemList1[0].healthCheckPackageReCheckPriceDtosMap[setCheckType]"
                                 :key="index">
                  <template slot-scope="scoped">
                    <el-input v-model="scoped.row.healthCheckPackageReCheckPriceDtosMap[setCheckType][scoped.$index].price"
                              :placeholder='`请输入${item.doctorTitleName}`'
                              class="w-150" />
                  </template>
                </el-table-column>
              </template>
            </el-table>
          </el-form-item>
        </template>

        <!-- 报告拆分 -->
        <div v-if="formdata.split === 1">
          <el-form-item label="拆分情况：">
            <el-button type="primary"
                       @click="handleAdd(5)">新 增 一 项</el-button>
            <el-table :data="itemList2"
                      style="width: 100%"
                      border
                      class="mt-20">
              <el-table-column prop="price"
                               label="价格"
                               width="200">
                <template slot-scope="scoped">
                  <!-- 这是每组价格项的healthCheckPackageItemId= {{scoped.row.healthCheckPackageItemId}} -->
                  <el-select v-model="scoped.row.price"
                             placeholder="请选择"
                             clearable
                             @change="(value)=>{upchange(value,scoped.$index)}">
                    <el-option v-for="(item,index) in formdata.itemList"
                               :key="index"
                               :label="`${(item.price || '')+'元'+'/'+(item.num || '')+((item.unit==1?'小时':'次') || '')}`"
                               :value="item.price"></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column prop="detectIndie"
                               label="检测项目">
                <template slot-scope="scoped">
                  <!-- {{scoped.row.detectIndie}} -->
                  <el-select v-model="scoped.row.detectIndie"
                             multiple
                             @change="(value)=>{updataCheckProject(value,scoped.$index)}"
                             placeholder="请选择检测项目">
                    <el-option :label="item.name"
                               :value="item.key"
                               v-for="item in scoped.row.options"
                               :key="item.key"></el-option>
                  </el-select>

                </template>
              </el-table-column>
              <el-table-column label="是否特殊项目">
                <template slot-scope="scoped">

                  <el-switch v-model="scoped.row.specialItem"
                             active-color="#13ce66"
                             inactive-color="#dcdfe6"
                             :active-value="1"
                             :inactive-value="0">
                  </el-switch>

                </template>
              </el-table-column>
              <el-table-column label="是否执行分析复核流程">
                <template slot-scope="scoped">
                  <el-switch v-model="scoped.row.reCheck"
                             active-color="#13ce66"
                             inactive-color="#dcdfe6"
                             :active-value="1"
                             :inactive-value="0">
                  </el-switch>
                </template>
              </el-table-column>
              <el-table-column header-align="center"
                               align="center"
                               prop="prop"
                               width="120"
                               label="操 作">
                <template slot-scope="scoped">
                  <el-button type="danger"
                             @click='delRow(scoped.$index, itemList2, 3)'>删 除</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-form-item>
          <el-form-item label="分析分成：">
            <el-radio-group v-model="setType"
                            @change="changeSetType">
              <el-radio-button :label="0">医 师</el-radio-button>
              <el-radio-button :label="2">技 师</el-radio-button>
              <el-radio-button :label="7">检验师</el-radio-button>
            </el-radio-group>
            <!-- 医师、技师、检验师 -->
            <template>
              <el-table :data="itemList2"
                        border
                        style="width: 100%"
                        class="mt-20">
                <el-table-column prop="price"
                                 label="价格"
                                 width="200">
                  <template slot-scope="scoped">
                    <!-- 这是每组价格项的healthCheckPackageItemId={{scoped.row.healthCheckPackageItemId}}
                    <br /> -->
                    <el-tag type="primary">{{(scoped.row.price || '')+'元'+'/'+(scoped.row.num || '')+((scoped.row.unit==1?'小时':'次') || '')}}</el-tag>
                  </template>
                </el-table-column>
                <el-table-column prop="detectIndie"
                                 label="检测项目">
                  <template slot-scope="scoped">
                    <!-- 下标detectIndies={{scoped.row.detectIndie}} -->
                    <el-select v-model="scoped.row.detectIndie"
                               multiple
                               :disabled="true"
                               placeholder="请选择检测项目">
                      <el-option :label="item.name"
                                 :value="item.key"
                                 v-for="(item,index) in scoped.row.options"
                                 :key="index"></el-option>
                    </el-select>

                  </template>
                </el-table-column>
                <template v-if="itemList2&&itemList2.length">
                  <el-table-column :prop="`${item.doctorTitleName}${index}`"
                                   :label="item.doctorTitleName"
                                   v-for="(item,index) in itemList2[0].healthCheckPackageReadPriceDtosMap[setType]"
                                   :key="index">
                    <template slot-scope="scoped">

                      <el-input v-model="scoped.row.healthCheckPackageReadPriceDtosMap[setType][index].price"
                                :placeholder='`请输入${item.doctorTitleName}`'
                                class="w-150" />
                    </template>
                  </el-table-column>
                </template>
              </el-table>
            </template>

          </el-form-item>
          <!-- 复核分成 -->
          <el-form-item label="复核分成：">
            <el-radio-group v-model="setCheckType"
                            @change="changeSetCheckType">
              <el-radio-button :label="0">医 师</el-radio-button>
              <el-radio-button :label="2">技 师</el-radio-button>
              <el-radio-button :label="7">检验师</el-radio-button>
            </el-radio-group>
            <!-- 医师、技师、检验师 -->
            <template>
              <el-table :data="itemList2"
                        border
                        style="width: 100%"
                        class="mt-20">
                <el-table-column prop="price"
                                 label="价格"
                                 width="200">
                  <template slot-scope="scoped">
                    <el-tag type="primary">{{(scoped.row.price || '')+'元'+'/'+(scoped.row.num || '')+((scoped.row.unit==1?'小时':'次') || '')}}</el-tag>
                  </template>
                </el-table-column>
                <el-table-column prop="detectIndie"
                                 label="检测项目">
                  <template slot-scope="scoped">
                    <el-select v-model="scoped.row.detectIndie"
                               multiple
                               :disabled="true"
                               placeholder="请选择检测项目">
                      <el-option :label="item.name"
                                 :value="item.key"
                                 v-for="(item,index) in scoped.row.options"
                                 :key="index"></el-option>
                    </el-select>

                  </template>
                </el-table-column>
                <template v-if="itemList2&&itemList2.length">
                  <el-table-column :prop="`${item.doctorTitleName}${index}`"
                                   :label="item.doctorTitleName"
                                   v-for="(item,index) in itemList2[0].healthCheckPackageReCheckPriceDtosMap[setCheckType]"
                                   :key="index">
                    <template slot-scope="scoped">
                      <el-input v-model="scoped.row.healthCheckPackageReCheckPriceDtosMap[setCheckType][index].price"
                                :placeholder='`请输入${item.doctorTitleName}`'
                                class="w-150" />
                    </template>
                  </el-table-column>
                </template>
              </el-table>
            </template>
          </el-form-item>
        </div>
        <el-form-item label="特别说明："
                      prop="specialNote">
          <el-input v-model="formdata.specialNote"
                    maxlength="500"
                    :rows="4"
                    type="textarea"
                    autocomplete="off"
                    show-word-limit
                    style="width:50%"
                    placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="医学知识："
                      prop="detectList">
          <el-button type="success"
                     @click="handleAdd(2)">新 增 一 项</el-button>
          <el-table :data="loreList"
                    style="width: 100%"
                    class="mt-20"
                    border>
            <el-table-column prop="name"
                             label="项目名称"
                             width="200">
              <template slot-scope="scoped">
                <el-input v-model="scoped.row.name"
                          maxlength="50"
                          autocomplete="off"
                          placeholder="请输入"></el-input>
              </template>
            </el-table-column>
            <el-table-column prop="address"
                             label="临床意义">
              <template slot-scope="scoped">
                <el-input v-model="scoped.row.clinicalWorth"
                          maxlength="500"
                          :rows="4"
                          type="textarea"
                          autocomplete="off"
                          show-word-limit
                          placeholder="请输入"></el-input>
              </template>
            </el-table-column>
            <el-table-column prop="address"
                             label="图片"
                             width="150">
              <template slot-scope="scoped">
                <div @click="op(scoped.$index)">
                  <el-upload class="avatar-uploader"
                             :action="imageUploadUrl"
                             :show-file-list="false"
                             accept=".JPG, .PNG, .JPEG,.jpg, .png, .jpeg"
                             :on-success="loreListSuccess"
                             :before-upload="beforeAvatarUpload">
                    <img v-if="scoped.row.imageUrl"
                         :src="scoped.row.imageUrl"
                         class="avatar">
                    <i v-else
                       class="el-icon-plus avatar-uploader-icon"></i>
                  </el-upload>
                </div>

              </template>
            </el-table-column>
            <el-table-column prop="address"
                             label="操作"
                             width="100">
              <template slot-scope="scoped">
                <el-button type="text"
                           @click='delRow(scoped.$index,loreList)'>删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-form-item>
        <el-form-item label="医学知识链接："
                      prop="detectList">
          <el-button type="success"
                     @click="handleAdd(3)">新 增 一 项</el-button>
          <el-table :data="loreListOther"
                    style="width: 100%"
                    class="mt-20"
                    border>
            <el-table-column prop="name"
                             label="链接标题">
              <template slot-scope="scoped">
                <el-input v-model="scoped.row.name"
                          maxlength="50"
                          autocomplete="off"
                          placeholder="请输入"></el-input>
              </template>
            </el-table-column>
            <el-table-column prop="address"
                             label="链接">
              <template slot-scope="scoped">
                <el-input v-model="scoped.row.linkUrl"
                          type="textarea"
                          maxlength="500"
                          :rows="4"
                          autocomplete="off"
                          show-word-limit
                          placeholder="请输入"></el-input>
              </template>
            </el-table-column>
            <el-table-column prop="address"
                             label="操作"
                             width="100">
              <template slot-scope="scoped">
                <el-button type="text"
                           @click='delRow(scoped.$index,loreListOther)'>删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-form-item>
        <el-form-item label="复核医生："
                      v-if="formdata.reCheck === 1">
          <reviewDoctorList :hospitalList="formdata.hospitalList"></reviewDoctorList>
        </el-form-item>
        <el-form-item label="购买服务后，是否填写健康服务号："
                      label-width="240px">
          <el-radio-group v-model="formdata.isInvitationCode">
            <el-radio :label="1">是</el-radio>
            <el-radio :label="0">否</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>
      <p align="center"
         class="mt-20">
        <el-button @click="modalClose">取 消</el-button>
        <el-button type="primary"
                   @click="onSubmit">保 存</el-button>
      </p>
    </el-dialog>

  </div>
</template>

<script>
  import reviewDoctorList from './reviewDoctorList';

  export default {
    props: ['dialogData', 'visible'],
    data () {
      return {
        loading: false,
        dialogVisible: false,
        fullscreenLoading: false,
        healthRiskType: [],
        rules: {
          name: [
            { required: true, message: '请填写分类名称' }
          ],
          healthRiskTypeId: [
            { required: true, message: '请选择所属分类' }
          ],
          imageUrl: [
            { required: true, message: '请填上传列表图片' }
          ],
          detailImageUrl: [
            { required: true, message: '请上传详情图片' }
          ],
          itemList: [
            { required: true, message: '请完善服务选项' }
          ],
          standardService: [
            { required: true, message: '请填写标配服务' }
          ],
          hospitalList: [
            { required: true, message: '请选择服务医院' }
          ],
          rangeContent: [
            { required: true, message: '请选择服务医院' }
          ],
          detectList: [
            { required: true, message: '请完善检测项目列表' }
          ],
          specialNote: [
            { required: true, message: '请填写特别说明' }
          ]
        },
        formdata: {
          type: 1,
          imageUrl: null,
          detailImageUrl: [],
          detailImage: [],
          itemList: [{}],
          detectList: [{
            id: 0,
            healthCheckPackageItemId: 0
          }],
          hospitalList: [],
          hospitalListNum: [],
          isInvitationCode: 0,
          split: 0, // 分成设置
          specialItem: 1, // 是否是特殊筛查项目
          reCheck: 1, // 是否执行分析复核流程
        },
        detailImageUrlArr: [],
        setType: 0,
        setCheckType: 0,
        itemList1: [
          {
            healthCheckPackageReadPriceDtosMap: {
              0: [
                { price: '', doctorTitleId: 3, doctorTitleName: "主任医师" },
                { price: '', doctorTitleId: 4, doctorTitleName: "副主任医师" },
                { price: '', doctorTitleId: 6, doctorTitleName: "主治医师" },
                { price: '', doctorTitleId: 7, doctorTitleName: "住院医师" },
                { price: '', doctorTitleId: 32, doctorTitleName: "公共卫生执业医师" }
              ],
              2: [
                { price: '', doctorTitleId: 15, doctorTitleName: "主任技师" },
                { price: '', doctorTitleId: 16, doctorTitleName: "副主任技师" },
                { price: '', doctorTitleId: 17, doctorTitleName: "主管技师" },
                { price: '', doctorTitleId: 18, doctorTitleName: "技师" }
              ],
              7: [
                { price: '', doctorTitleId: 47, doctorTitleName: "主任检验师" },
                { price: '', doctorTitleId: 48, doctorTitleName: "副主任检验师" },
                { price: '', doctorTitleId: 49, doctorTitleName: "主管检验师" },
                { price: '', doctorTitleId: 50, doctorTitleName: "检验师" },
                { price: '', doctorTitleId: 51, doctorTitleName: "检验士" }
              ]
            },
            healthCheckPackageReCheckPriceDtosMap: {
              0: [
                { price: '', doctorTitleId: 3, doctorTitleName: "主任医师", },
                { price: '', doctorTitleId: 4, doctorTitleName: "副主任医师" },
                { price: '', doctorTitleId: 6, doctorTitleName: "主治医师" }
              ],
              2: [
                { price: '', doctorTitleId: 15, doctorTitleName: "主任技师" },
                { price: '', doctorTitleId: 16, doctorTitleName: "副主任技师", },
                { price: '', doctorTitleId: 17, doctorTitleName: "主管技师", }
              ],
              7: [
                { price: '', doctorTitleId: 47, doctorTitleName: "主任检验师", },
                { price: '', doctorTitleId: 48, doctorTitleName: "副主任检验师" },
                { price: '', doctorTitleId: 49, doctorTitleName: "主管检验师" }
              ]
            }
          }
        ],

        itemList2: [
          {
            healthCheckPackageReadPriceDtosMap: {
              0: [
                { price: '', doctorTitleId: 3, doctorTitleName: "主任医师" },
                { price: '', doctorTitleId: 4, doctorTitleName: "副主任医师" },
                { price: '', doctorTitleId: 6, doctorTitleName: "主治医师" },
                { price: '', doctorTitleId: 7, doctorTitleName: "住院医师" },
                { price: '', doctorTitleId: 32, doctorTitleName: "公共卫生执业医师" }
              ],
              2: [
                { price: '', doctorTitleId: 15, doctorTitleName: "主任技师" },
                { price: '', doctorTitleId: 16, doctorTitleName: "副主任技师" },
                { price: '', doctorTitleId: 17, doctorTitleName: "主管技师" },
                { price: '', doctorTitleId: 18, doctorTitleName: "技师" }
              ],
              7: [
                { price: '', doctorTitleId: 47, doctorTitleName: "主任检验师" },
                { price: '', doctorTitleId: 48, doctorTitleName: "副主任检验师" },
                { price: '', doctorTitleId: 49, doctorTitleName: "主管检验师" },
                { price: '', doctorTitleId: 50, doctorTitleName: "检验师" },
                { price: '', doctorTitleId: 51, doctorTitleName: "检验士" }
              ]
            },
            healthCheckPackageReCheckPriceDtosMap: {
              0: [
                { price: '', doctorTitleId: 3, doctorTitleName: "主任医师", },
                { price: '', doctorTitleId: 4, doctorTitleName: "副主任医师" },
                { price: '', doctorTitleId: 6, doctorTitleName: "主治医师" }
              ],
              2: [
                { price: '', doctorTitleId: 15, doctorTitleName: "主任技师" },
                { price: '', doctorTitleId: 16, doctorTitleName: "副主任技师", },
                { price: '', doctorTitleId: 17, doctorTitleName: "主管技师", }
              ],
              7: [
                { price: '', doctorTitleId: 47, doctorTitleName: "主任检验师", },
                { price: '', doctorTitleId: 48, doctorTitleName: "副主任检验师" },
                { price: '', doctorTitleId: 49, doctorTitleName: "主管检验师" }
              ]
            }
          }
        ],
        emphasisHospital: [],
        emphasisHospitalList: [],
        loreList: [{
          type: 1,
        }],
        loreListOther: [{
          type: 2
        }],
        tableData: [{}],
        options1: [],
        dataList: [],
        imageUploadUrl: this.api.appUpgradeUpload.url,
        selectHospitalIds: [],
        whichImg: 0,
        hospitalListTableDataVisible: false,
      }
    },
    methods: {
      modalClose () {
        this.$emit('update:visible', false); // 直接修改父组件的属性
      },
      //拆分情况，分析分成，选择价格重置处理
      upchange (val, key) {
        this.itemList2[key].price = val;
        this.itemList2[key].detectIndie = [];
        this.itemList2[key].options = [];
        this.formdata.detectList.forEach(item => {
          if (item.price === this.itemList2[key].price) {
            this.itemList2[key].options.push(item);
          }
        });
        this.formdata.itemList.forEach(item => {
          if (item.price === val) {
            this.itemList2[key].healthCheckPackageItemId = item.id;
          }
        })
        this.itemList2[key].options.forEach((item, index) => {
          item.key = index;
        })
      },
      //检测项目选择处理改变值变化
      updataCheckProject (val, key) {
        this.itemList2[key].detectIndie = val;
      },
      //检测项目配置 选择价格重置处理
      updataCheckProjectPrice (val, key, id) {
        this.itemList2.forEach(item => {
          item.detectIndie = [];
          let temp = [];
          this.formdata.detectList.forEach(subItem => {
            if (subItem.price === val) {
              temp.push(subItem);
            } else {
              let option = item.options.filter(item => {
                return id ? id != item.id : item;
              });

              option.forEach((threeItem, threeIndex) => {
                threeItem.key = threeIndex;
              })
              item.options = option;
            }
          })

          this.formdata.detectList.forEach(item => {
            this.formdata.itemList.forEach(subItem => {
              if (subItem.price === val) {
                this.$set(item, 'healthCheckPackageItemId', subItem.id);
              }
            })
          })
          if (temp.length) {
            temp.forEach((item, index) => {
              item.key = index;
            })
            if (item.price === temp[0].price) {
              item.options = temp;
            }
          }
        })
        this.formdata.detectList[key].price = val;
      },
      // 获取检测指标列表
      getDetectionList (query) {
        let param = {
          name: query,
          pageSize: 300,
          pageIndex: 0
        };
        this.post(this.api.deviceList.url, param).then((res) => {
          if (res.data.code === '200') {
            this.dataList = res.data.object;
          }
        })
      },

      //更改服务选项，拆分情况变化
      hadnleInput () {
        this.formdata.itemList.forEach((item, index) => {
          this.$set(this.itemList1[index], 'price', item.price);
          this.$set(this.itemList1[index], 'num', item.num);
          this.$set(this.itemList1[index], 'unit', item.unit);
        })

      },
      handleAdd (index, options) {
        switch (index) {
          case 0:
            if (this.formdata.split === 1) {
              this.formdata.itemList.push({ id: null });
            } else {
              this.itemList1.push({ ...this.itemList1[0], id: null });
              this.formdata.itemList.push({ id: null });
            }
            // this.formdata.itemList.push({ id: null });
            break
          case 1: // 检测项目配置
            // 拆分
            if (this.formdata.split === 1) {
              let arr = [], temp = [];
              if (options) {
                this.formdata.detectList.forEach(item => {
                  arr.push(item.healthCheckPackageItemId);
                  temp.push(item.id);
                })
                this.itemList2.forEach(item => {
                  item.oldOptions = item.options;
                })
              }
              this.formdata.detectList.push({
                price: '',
                detectIndie: [],
                id: null,
                healthCheckPackageItemId: null
              });
            }
            // 不拆分
            if (this.formdata.split === 0) {
              this.formdata.detectList.push({ id: null });
            }
            break
          case 2:
            this.loreList.push({ type: 1 });
            break
          case 3:
            this.loreListOther.push({ type: 2 });
            break
          case 4:
            break
          case 5:
            this.itemList2.push({
              healthCheckPackageReadPriceDtosMap: {
                0: [
                  { price: '', doctorTitleId: 3, doctorTitleName: "主任医师" },
                  { price: '', doctorTitleId: 4, doctorTitleName: "副主任医师" },
                  { price: '', doctorTitleId: 6, doctorTitleName: "主治医师" },
                  { price: '', doctorTitleId: 7, doctorTitleName: "住院医师" },
                  { price: '', doctorTitleId: 32, doctorTitleName: "公共卫生执业医师" }
                ],
                2: [
                  { price: '', doctorTitleId: 15, doctorTitleName: "主任技师" },
                  { price: '', doctorTitleId: 16, doctorTitleName: "副主任技师" },
                  { price: '', doctorTitleId: 17, doctorTitleName: "主管技师" },
                  { price: '', doctorTitleId: 18, doctorTitleName: "技师" }
                ],
                7: [
                  { price: '', doctorTitleId: 47, doctorTitleName: "主任检验师" },
                  { price: '', doctorTitleId: 48, doctorTitleName: "副主任检验师" },
                  { price: '', doctorTitleId: 49, doctorTitleName: "主管检验师" },
                  { price: '', doctorTitleId: 50, doctorTitleName: "检验师" },
                  { price: '', doctorTitleId: 51, doctorTitleName: "检验士" }
                ]
              },
              healthCheckPackageReCheckPriceDtosMap: {
                0: [
                  { price: '', doctorTitleId: 3, doctorTitleName: "主任医师", },
                  { price: '', doctorTitleId: 4, doctorTitleName: "副主任医师" },
                  { price: '', doctorTitleId: 6, doctorTitleName: "主治医师" }
                ],
                2: [
                  { price: '', doctorTitleId: 15, doctorTitleName: "主任技师" },
                  { price: '', doctorTitleId: 16, doctorTitleName: "副主任技师", },
                  { price: '', doctorTitleId: 17, doctorTitleName: "主管技师", }
                ],
                7: [
                  { price: '', doctorTitleId: 47, doctorTitleName: "主任检验师", },
                  { price: '', doctorTitleId: 48, doctorTitleName: "副主任检验师" },
                  { price: '', doctorTitleId: 49, doctorTitleName: "主管检验师" }
                ]
              }
            })
            break
        }
      },
      // 更新价格
      updataPrice (e, index, key) {
        this.itemList2[0].healthCheckPackageReadPriceDtosMap[this.setType][index].price = e;
      },
      // 动态删除检测项目配置
      delRow (index, table, option = false) {
        if (table.length == 1) {
          this.$message.warning('至少保留一项');
          return
        } else {
          // 删除 拆分
          if (this.formdata.split === 1) {
            let price = '';
            if (option !== 3) {
              price = table[index].price;
              table.splice(index, 1);
            }

            if (option == 1) {
              this.itemList2.forEach(item => {
                let temp = [];
                item.options = [];
                if (item.price === price) {
                  item.detectIndie = [];
                }
                table.forEach(subItem => {
                  if (item.price === subItem.price) {
                    temp.push(subItem);
                  }
                })
                if (temp.length) {
                  temp.forEach((subItem, subIndex) => {
                    subItem.key = subIndex;
                  })
                  item.options = temp;
                }
              })
            }
            if (option == 2) {
              this.itemList2 = this.itemList2.filter(item => {
                return item.price !== price;
              })
              this.formdata.detectList = this.formdata.detectList.filter(item => {
                return item.price !== price;
              })
            }
            if (option === 3) {
              this.itemList2 = table.filter((item, key) => {
                return key !== index;
              })
            }
          }
          // 删除不拆分
          if (this.formdata.split === 0) {
            table.splice(index, 1);

            /* if (option == 2) {
              this.itemList1 = this.itemList1.filter((item, index) => {
                return item.price !== table[index].price;
              })

            } */
          }
        }
      },
      // 更改拆分情况
      handleSetChange () {
        this.setType = this.setCheckType = '0';
      },
      // 删除检测项目配置时候，清空拆分情况，分析分成
      deleteReset () {
        this.itemList2.forEach(item => {
          item.detectIndie = [];
        })
      },
      // 查询服务医院
      gethospitalList (query) {
        if (query !== '') {
          this.loading1 = true;
          this.post(this.api.cooperationHospital.getServiceHospitalList, { "pageSize": 100, "pageStart": 0, "name": query }).then((res) => {
            if (res.data.code === '200') {
              this.options1 = res.data.object;
            }
          });
        } else {
          this.options1 = [];
        }
        this.loading1 = false;
      },
      // 选择服务医院
      changeHospital (val) {
        let temp = [];
        if (val.length > 0) {
          this.options1.forEach(item => {
            this.formdata.hospitalList.forEach(subItem => {
              if (item.hospitalId === subItem.hospitalId) {
                item.doctorDtos = subItem.doctorDtos;
                item.emphasisHospital = subItem.emphasisHospital;
              }
            })
          })

          this.options1.forEach(item => {
            if (val.includes(item.hospitalId)) {
              item.hospitalName = item.name;
              temp.push(item);
            }
          })
          this.emphasisHospitalList = temp;
          this.formdata.hospitalList = temp;
        }
      },

      // 是否是重点合作医院 多选
      checkboxItem (value, index, item) {
        this.formdata.hospitalList.forEach(hItem => {
          if (hItem.hospitalId === item.hospitalId) {
            hItem.emphasisHospital = value ? 1 : 0;
          }
        })
      },
      changeSetType (val) {
        this.setType = val;
      },
      changeSetCheckType (val) {
        this.setCheckType = val;
      },

      // 提交保存
      onSubmit () {
        let itemList = this.formdata.itemList, itemList2 = this.itemList2, detectList = this.formdata.detectList;
        itemList.forEach((item, index) => {
          item.detectList = [];
          item.healthCheckPackageSplitItemDtos = [];
          detectList.forEach(subItem => {
            if (item.price === subItem.price) {
              subItem.detectIndex = subItem.key;
              item.detectList.push(subItem);
            }
          })

          if (this.formdata.split === 1) {
            // 拆分
            itemList2.forEach(subItem => {
              if (subItem.detectIndie.length > 0) {
                subItem.detectIndies = JSON.stringify(subItem.detectIndie).replace(/"/g, '');
                if (item.price === subItem.price) {
                  item.healthCheckPackageSplitItemDtos.push(subItem);
                }
              }

            })
          } else {
            // 不拆分
            item.healthCheckPackageReadPriceDtosMap = this.itemList1[index].healthCheckPackageReadPriceDtosMap;
            item.healthCheckPackageReCheckPriceDtosMap = this.itemList1[index].healthCheckPackageReCheckPriceDtosMap;
          }

        })
        this.formdata.itemList = itemList;
        /*  if (!this.formdata.name) {
           this.$message.warning('请填写服务名称');
           return
         } */
        if (!this.formdata.healthRiskTypeId) {
          this.$message.warning('请选择所属分类');
          return
        }
        if (!this.formdata.imageUrl) {
          this.$message.warning('请上传列表图片');
          return
        }
        if (!this.detailImageUrlArr) {
          this.$message.warning('请上传详情图片');
          return
        }
        // 服务选项 判断添加行
        let resItemList = this.formdata.itemList
        if (resItemList.length > 0) {
          let itemList = resItemList[resItemList.length - 1]
          if (itemList.price === '' || itemList.price === undefined) {
            this.$message.error('请输入价格');
            return
          }
          if (itemList.unit === '' || itemList.unit === undefined) {
            this.$message.error('请选择单位');
            return
          }
          if (itemList.detectFee === '' || itemList.detectFee === undefined) {
            this.$message.error('请输入检测分成费用');
            return
          }
          if (itemList.extendFee === '' || itemList.extendFee === undefined) {
            this.$message.error('请输入推广分成费用');
            return
          }
        }

        // 检测项目配置 判断添加行
        let resDetectList = this.formdata.detectList;
        if (resDetectList.length > 0) {
          let itemDetectList = resDetectList[resDetectList.length - 1];
          if (itemDetectList.name === '' || itemDetectList.name === undefined) {
            this.$message.error('请输入检查项目');
            return
          }
        }

        // 医学知识
        this.formdata.loreList = this.loreList.concat(this.loreListOther);
        // 详情图片
        this.formdata.detailImageUrl = JSON.stringify(this.detailImageUrlArr);
        if (this.formdata.detailImage) {
          delete this.formdata.detailImage;
        }
        this.formdata.way = 1;

        this.post(this.api.cooperationHospital.healthCheckManageuploadInfo, this.formdata, { showFullScreenLoading: true })
          .then(res => {
            if (res.data.code === '200') {
              // loading.close();
              this.$message.success(res.data.message);
              this.$parent._getList();
              this.modalClose();
            }
          })
      },
      op (index) {
        this.whichImg = index;
      },
      loreListSuccess (res) {
        this.loreList.forEach((ele, index) => {
          if (this.whichImg == index) {
            this.$set(ele, 'imageUrl', res.object[0]);
          }
        })
        this.$forceUpdate();
      },
      handleAvatarSuccess (res) {
        this.formdata.imageUrl = res.object[0];
      },
      beforeAvatarUpload (file) {
        const isLt2M = file.size / 1024 / 1024 < 2;
        if (!isLt2M) {
          this.$message.error('上传图片大小不能超过 2MB!');
        }
        return isLt2M;
      },
      handlePictureCardPreview (res) {
        this.detailImageUrlArr.push(res.object[0]);
      },
      onremove (res, list) {
        console.log('res',res)
        if (res.response) {
          this.detailImageUrlArr = this.detailImageUrlArr.filter(ele => ele != res.response.object[0]);
        } else {
          this.detailImageUrlArr = this.detailImageUrlArr.filter(ele => ele != res.url);
        }
        console.log('detailImageUrlArr',this.detailImageUrlArr)
      },
      onexceed () {
        this.$message.warning('详情图片至多上传6张');
      },
      // 所属分类
      getClassification () {
        this.post(this.api.cooperationHospital.healthRiskTypegetPageList, {
          pageIndex: 0,
          pageSize: 100
        }).then(res => {
          if (res.data.code === '200') {
            this.healthRiskType = res.data.object;
          }
        })
      },
      // 查询详情
      getDetail () {
        if (this.dialogData.info) {
          this.post(this.api.cooperationHospital.healthCheckManagegetDetail, {
            id: this.dialogData.info.id
          }).then(res => {
            if (res.data.code === '200') {
              let resData = res.data.object;
              this.formdata = resData;

              this.itemList = resData.itemList;
              this.detailImageUrlArr = JSON.parse(this.formdata.detailImageUrl);
              this.formdata.detailImage = [];
              this.formdata.detectList = [];
              this.itemList2 = [];
              this.detailImageUrlArr.forEach(ele => {
                let op = {};
                op.name = ele;
                op.url = ele;
                this.formdata.detailImage.push(op);
              })
              if (this.formdata.hospitalList) {
                this.formdata.hospitalList.forEach(item => {
                  this.emphasisHospitalList.push({
                    id: item.id,
                    healthCheckPackageId: item.healthCheckPackageId,
                    hospitalId: item.hospitalId,
                    emphasisHospital: item.emphasisHospital,
                    hospitalName: item.hospitalName
                  })
                  this.emphasisHospital.push({
                    hospitalId: item.hospitalId,
                    emphasisHospital: item.emphasisHospital,
                    hospitalName: item.hospitalName
                  })
                  this.gethospitalList(item.hospitalName);
                })
                // 回显服务医院
                this.formdata.hospitalListNum = this.formdata.hospitalList.map(item => item.hospitalId);

              } else {
                this.formdata.hospitalList.push({
                  id: null,
                  healthCheckPackageId: this.dialogData.info.id,
                  hospitalId: '',
                  emphasisHospital: 0,
                  hospitalName: '',
                  medicalUnionId: 0,
                  reCheckDoctorIds: '[]',
                  doctorDtos: []
                })
              }
              if (this.formdata.split === 0) {
                this.itemList1 = this.itemList;
              }
              // 回显数据
              this.formdata.itemList.forEach((abc, index) => {
                if (abc.detectList) {
                  abc.detectList.forEach(op => {
                    this.$set(op, 'price', abc.price);
                    this.formdata.detectList.push(op);
                  })
                }
                if (abc.healthCheckPackageSplitItemDtos) {
                  abc.healthCheckPackageSplitItemDtos.forEach(item => {
                    item.price = abc.price;
                  })
                }
                if (this.formdata.split === 1) {
                  this.itemList2 = [...this.itemList2, ...abc.healthCheckPackageSplitItemDtos]
                }
              })

              if (this.formdata.split === 1) {
                this.itemList2.forEach(item => {
                  this.$set(item, 'options', []);
                  this.$set(item, 'oldOptions', []);
                  this.$set(item, 'detectIndie', JSON.parse(item.detectIndies));
                  this.formdata.detectList.forEach(subItem => {
                    if (item.price === subItem.price) {
                      item.options.push(subItem);
                      item.oldOptions = item.options;
                    }
                  })
                });
                this.itemList2.forEach(item => {
                  item.options.forEach((subItem, subIndex) => {
                    subItem.key = subIndex;
                  });
                  item.oldOptions = item.options;
                })
              }
              this.getDetectionList('');
              this.loreList = this.formdata.loreList.filter(ele => ele.type == 1);
              this.loreListOther = this.formdata.loreList.filter(ele => ele.type == 2);
              this.$forceUpdate();
              console.log('回显数据',this.formdata.itemList)
            }
          })

        } else {
          this.getDetectionList('');
        }
      }
    },
    created () {
      this.getClassification(); // 查询所属分类
      this.getDetail(); // 查询详情
    },
    components: {
      reviewDoctorList
    }
  }
</script>

<style scoped lang="scss">
  .w-150 {
    width: 150px;
  }
  .el-upload-list--picture-card .el-upload-list__item {
    width: 98px !important;
    height: 98px !important;
  }
  .el-upload--picture-card {
    width: 98px !important;
    height: 98px !important;
    line-height: 98px !important;
  }
  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409eff;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 98px !important;
    height: 98px !important;
    line-height: 98px !important;
    text-align: center;
  }
  .avatar {
    width: 98px !important;
    height: 98px !important;
    display: block;
  }
  .ivu-select-dropdown {
    z-index: 1000 !important;
  }
</style>
